// Local Tailwind CSS - Production Version
// This is a simplified local version to replace the CDN version

(function() {
  'use strict';
  
  // Tailwind CSS configuration
  window.tailwind = {
    config: {
      theme: {
        extend: {
          colors: {
            primary: '#FFE45C',
            secondary: '#FFE45C',
            accent: '#10B981'
          },
          borderRadius: {
            'none': '0px',
            'sm': '2px',
            DEFAULT: '4px',
            'md': '8px',
            'lg': '12px',
            'xl': '16px',
            '2xl': '20px',
            '3xl': '24px',
            'full': '9999px',
            'button': '8px'
          },
          animation: {
            'fade-in': 'fadeIn 0.6s ease-in-out',
            'slide-up': 'slideUp 0.8s ease-out',
            'bounce-gentle': 'bounceGentle 2s infinite'
          },
          keyframes: {
            fadeIn: {
              '0%': { opacity: '0' },
              '100%': { opacity: '1' }
            },
            slideUp: {
              '0%': { transform: 'translateY(30px)', opacity: '0' },
              '100%': { transform: 'translateY(0)', opacity: '1' }
            },
            bounceGentle: {
              '0%, 100%': { transform: 'translateY(0)' },
              '50%': { transform: 'translateY(-10px)' }
            }
          }
        }
      }
    }
  };

  // Initialize Tailwind CSS
  if (typeof window.tailwind !== 'undefined') {
    // Apply configuration if provided
    if (window.tailwind.config) {
      // Configuration is already set in the HTML
    }
  }

  // Add CSS for animations
  const style = document.createElement('style');
  style.textContent = `
    @keyframes fadeIn {
      0% { opacity: 0; }
      100% { opacity: 1; }
    }
    
    @keyframes slideUp {
      0% { transform: translateY(30px); opacity: 0; }
      100% { transform: translateY(0); opacity: 1; }
    }
    
    @keyframes bounceGentle {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-10px); }
    }
    
    .animate-fade-in {
      animation: fadeIn 0.6s ease-in-out;
    }
    
    .animate-slide-up {
      animation: slideUp 0.8s ease-out;
    }
    
    .animate-bounce-gentle {
      animation: bounceGentle 2s infinite;
    }
  `;
  document.head.appendChild(style);

})(); 